<!-- 报表表格分页组件 -->

<template>
    <div class="reportTablePage">
        <el-pagination v-model:current-page="pageInfo.currentPage" v-model:page-size="pageInfo.pageSize" :page-sizes="[10, 20, 30, 40, 50, 100]"
            :disabled="disabled" :background="background" layout="sizes, prev, pager, next, jumper, total"
            :total="pageInfo.total" @size-change="handleSizeChange" @current-change="handleCurrentChange" />
    </div>
</template>

<script setup>
import { ref } from 'vue';

const disabled = ref(false);
const background = ref(false);

const pageInfo = defineModel('pageInfo');

const emit = defineEmits(['handleSearchForm']);

const handleCurrentChange = (val) => {
    pageInfo.value.currentPage = val;
    emit('handleSearchForm', 'page');
};

const handleSizeChange = (val) => {
    pageInfo.value.pageSize = val;
    emit('handleSearchForm', 'page');
};

</script>

<style lang="scss" scoped>
@import "./index.scss";
</style>